<#include '/admin/header.html' >
<style>
 td .layui-btn{
  background:#1E9FFF;
  }
    #start_time_one{
  height:25px;
  }
  #end_time_one{
  height:25px;
  }
  ._inline{
  margin-right:16px!important;
  margin-top:5px;
  height:25px;
  }
  .search_conditions{
display:block
}
</style>
<div  class="admin-main">
   <div>
        <!--提示区域  -->
        <div class="page_explain">
            <h2>操作提示</h2>
            <ul>
                <li><span>·</span>该列表展示所有未付款和已付款的订单，但无法进行删除和相关操作，而可以进行查看详情。</li>
            </ul>
        </div>
        <!--按钮操作  -->
        <div class="table_control">
            <div class="table_opera">
                <button type="button" class="layui-btn layui-btn-primary" title="提示" id="explain"><i class="icon iconfont icon-tishi1"></i></button>
            </div>
            <!--搜索区域  -->
            <div class="table_search">
                <input type="text" id="_search" placeholder="请输入流水号" style="height:25px;">
                <button type="button" class="layui-btn layui-btn-primary layui-btn-small" onclick="_searchPayment()"><i class="layui-icon">&#xe615;</i></button>
                <button type="button" class="layui-btn layui-btn-primary layui-btn-small" id="high_search">高级搜索</button>
                <!--高级搜索区域  -->
                <div class="high_searchcontent">
                    <div class="content_title"><span>高级搜索</span></div>
                    <form id="search_form" class="layui-form" action="post">
                        <div class="layui-form-item">
                            <label class="layui-form-label">流水号:</label>
                            <div class="layui-input-block">
                                <input type="text" id="sn"  lay-verify="title" autocomplete="off" placeholder="请输入流水号" class="layui-input">
                            </div>
                        </div>
                        
                        <div class="layui-form-item">
                            <label class="layui-form-label">付款状态</label>
                            <div class="layui-input-block">
                                <select id="paystatus"  lay-filter="">
                                    <option value="">---所有---</option> 
									<#list payStatusList as status>
										<option value="${status.key}">${status.value}</option> 
									</#list>
                                </select>
                            </div>
                        </div>
                        
                        <div class="layui-form-item">
                            <label class="layui-form-label">支付方式</label>
                            <div class="layui-input-block">
                                <select id="payment_id"  lay-filter="">
                                    <option value="">---所有---</option>
                                    <#list payTypeList as plist>
										<option value="${plist.id}">${plist.name}</option>
									</#list>
                                </select>
                            </div>
                        </div>
                        
                        <div class="layui-form-item" style="width:100%;">
   							 <label class="layui-form-label" >下单时间</label>
    						<div class="layui-input-inline" >
      							<input class="layui-input" placeholder="开始日" id="start_time">
    						</div>
    						<div class="layui-input-inline">
      							<input class="layui-input" placeholder="截止日" id="end_time">
    						</div>
  						</div>
  						
                        <ul>
                            <li class="reset">
                                <button type="reset" id="reset_btn" class="layui-btn  layui-btn-primary">重置</button>
                            </li>
                            <li class="submit">
                                <button type="button" id="submit_btn" class="layui-btn layui-btn-primary"  onclick="_highSearchPayment()" lay-submit="" lay-filter="highsearch" >开始搜索</button>
                            </li>
                        </ul>
                    </form>
                </div>
            </div>
        </div>
    </div>
    <!--高级搜索生成区域  -->
    <div class="high_search">
     	<form action="" class="layui-form layui-form-one" action="">
   		</form> 	
    </div>
     <!-- //高级搜索区克隆区域 -->
      <div class="kelong" style="display:none;">
   		<ul  class="search_conditions " style="width:98%; ">
 			<li>
 				 <div class="layui-form-item _select">
                       <label class="layui-form-label  _label" >流水号</label>
                  <div class="layui-input-block _layui-input-block">
                        <input type="text" id="sn_one" readonly="true" class="layui-input">
                  </div>
                  </div>
                  <span>
                  	<a class="closeSelf" href="javascript:void (0)">
                  		<i class="layui-icon" style="color: #5f8bca;">&#x1006;</i>
                 	</a>
                  </span>
 			</li>
 				<li>
 			    <div class="layui-form-item  _select">
                  <label class="layui-form-label _label">付款状态</label>
                  <div class="layui-input-block _layui-input-block">
                    	<input type="text" id="paystatus_one" readonly="true" class="layui-input">
                  </div>
                   </div>
              	 	<span>
	                  	<a class="closeSelf" href="javascript:void (0)">
	                  		<i class="layui-icon" style="color: #5f8bca;">&#x1006;</i>
	                 	</a>
                  </span>
 			</li>
 	
 			<li>
 			    <div class="layui-form-item  _select">
                  <label class="layui-form-label _label">支付方式</label>
                  <div class="layui-input-block _layui-input-block">
                    	<input type="text" id="payment_id_one" readonly="true" class="layui-input">
                  </div>
               	</div>
          	 	<span>
	              	<a class="closeSelf" href="javascript:void (0)">
	              		<i class="layui-icon" style="color: #5f8bca;">&#x1006;</i>
	             	</a>
              </span>
 			</li>
 			<li>
 			    <div class="layui-form-item  ">
                      <label class="layui-form-label _select">下单时间</label>
                         <div class="layui-input-inline _inline" >
                           <input type="text" id="start_time_one" readonly="true" class="layui-input">
                         </div>
                          <div class="layui-input-inline _inline" >
                         	 <input type="text" id="end_time_one"   readonly="true" class="layui-input">
                         </div>
                   </div>
              	 	<span style="float:right;margin-top:-43px;">
	                  	<a class="closeSelf" href="javascript:void (0)">
	                  		<i class="layui-icon" style="color: #5f8bca;">&#x1006;</i>
	                 	</a>
                  </span>
 			</li>
 		</ul>
   </div>

    <table id="dgs" class="layui-table site-table table-hover " width="100%" lay-skin="line">
        <thead>
          <tr>
            <th>流水号</th>
            <th>支付方式</th>
            <th>付款日期</th>
            <th>付款金额</th>
            <th>已结算金额</th>
            <th>付款人</th>
            <th>状态</th>
            <th>操作</th>
          </tr>
        </thead>
    </table>
    <!--传值等操作(暂时)  -->
    <div id="addBrand" ></div>
</div>

<!--js区域  -->
<script>


var index = parent.layer.getFrameIndex(window.name);

layui.use(['form', 'layedit', 'laydate'], function(){
    var form = layui.form()
        ,layer = layui.layer
        ,layedit = layui.layedit
        ,laydate = layui.laydate;
    
	form.on('submit(highsearch)', function(data){
		 $(".layui-form-one>ul").remove();
			$(".high_search").css("display","block");
			var kelo=$(".kelong ul").clone();
			kelo.appendTo($(".high_search form"));
			/* 赋值 */
			var gjsn=$("#sn").val();
			$("#sn_one").val(gjsn);
			  var gjpay=$("#paystatus").find("option:selected").text();
		       $("#paystatus_one").val(gjpay);
		       var gjpay=$("#payment_id").find("option:selected").text();
		       $("#payment_id_one").val(gjpay);
		       var gjstart=$("#start_time").val();
		       $("#start_time_one").val(gjstart);
		       var gjend=$("#end_time").val();
		       $("#end_time_one").val(gjend);
		       $(".closeSelf").click(function(){
					$(this).parent().parent().detach();
					})
			
	});
});

var table;
$(function(){
	
	 $("#high_search").on("click",function(event){
	    	event.stopPropagation();
	     	event.stopImmediatePropagation();
	        $(".high_searchcontent").toggle();
	    })
	
	table = $('#dgs').DataTable({
		"language": {
	        "url": "${staticserver}/media/zh_CN.txt"
	    },
	    "processing": true,
	    "serverSide": true,
	    "ordering": false,
	    "searching": false,
	    "lengthChange": false,
	    ajax: {
	        //指定数据源
	        type:"post",
	        url: '${ctx}/shop/admin/order-report/payment-list-json.do',
	    },
	    columns: [ //定义列
	        {data: "order_sn"},
	        {data: "pay_method"},	        
	        {data: function(paydata) {
	        	if(paydata.pay_date==0){
	        		return "";
	        	}
	        	else{
	        		return getFormatDateByLong(paydata.pay_date, "yyyy-MM-dd");
	        	}
	       	}},
	        {data: "money"},
	        {data: "paymoney"},
	        {data: "pay_user"},
	        {data: null,"render":function(data,type,row){
	        	var val;
	    		if(data.status==2){
	    		  val="已付款"
	    		}else{
	    		  val="未付款"
	    		}
	    		return val;
	        }},
	        {data: null,"render": function(data, type, row) {
	        	return "<a class='layui-btn layui-btn-small _aa' name='orderId' onclick='paydetail("+row.order_id+")'>操作</a>";		//获取值:data["brand_id"]
	       	}}
	     ]
	});
	
	//layui日期控件配置
	layui.use('laydate', function(){
		  var laydate = layui.laydate;
		  
		  var start = {
		    min: '2014-01-01 23:59:59',
		    max: '2099-06-16 23:59:59',
		    istoday: false,
		    choose: function(datas){
		      end.min = datas; //开始日选好后，重置结束日的最小日期
		      end.start = datas //将结束日的初始值设定为开始日
		    }
		  };
		  
		  var end = {
		    min: '2014-01-01 23:59:59',
		    max: '2099-06-16 23:59:59',
		    istoday: false,
		    choose: function(datas){
		      start.max = datas; //结束日选好后，重置开始日的最大日期
		    }
		  };
		  
		  document.getElementById('start_time').onclick = function(){
		    start.elem = this;
		    laydate(start);
		  }
		  document.getElementById('end_time').onclick = function(){
		    end.elem = this
		    laydate(end);
		  }
		  
		});
});

//查看付款单
function paydetail(orderId){
	layer.open({
        title:"付款单",//标题
        maxmin :true,//右上角可否放大缩小
        type:2,//弹框的类型
        shade: [0.3, '#000'],//黑色背景
        shadeClose:false,//黑色背景是否可以点击关闭
        content:'${ctx}/shop/admin/payment/show-dialog.do?orderId='+ orderId,//内容的URL
        area:['550px','480px'],//弹框大小
        scrollbar: false//是否允许浏览器出现滚动条
    });
}

//普通搜索
function _searchPayment(){
	var keyword = $("#_search").val();
	var param = "keyword="+keyword+"&stype="+0;
	var url = table.ajax.url(ctx+"/shop/admin/order-report/payment-list-json.do?"+param);
	url.load();
}

//高级搜索
function _highSearchPayment(){
	var start_time = $("#start_time").val();
	var end_time = $("#end_time").val();
	var sn = $("#sn").val();
	var paystatus =	$("#paystatus").val();
	var	payment_id = $("#payment_id").val();
	var param = "start_time="+start_time+"&end_time="+end_time+"&sn="+sn+"&paystatus="+paystatus+"&payment_id="+payment_id;
	table.ajax.url(ctx+"/shop/admin/order-report/payment-list-json.do?"+param).load();

}

</script>
<#include '/admin/footer.html' >
